<%@ page import="bean.Users" %>
<%@ page import="bean.HomeData" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib  prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
        *{
            border: 1px solid red;


        }

        body{

            width:1024px;
            margin:0px auto;

        }


        .top{
            height:30px;
            display: flex;
            justify-content: space-between;
        }

        a{
            text-decoration: none;
        }

        header{
            height:100px;
            display: flex;
        }

        form{
            display:flex;
            align-items: center;
        }
        form inputz{
            height: 30px;
            line-height: 40px;

        }
        input[type=search]{

            width:400px;
        }

        nav{
            height: 50px;
        }
        /*------------------------------------------------------------------------------------*/
        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            border: 1px solid #e7e7e7;
            background-color: #f3f3f3;
        }

        li {
            float: left;
        }

        li a {
            display: block;
            color: #666;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
        }

        li a:hover:not(.active) {
            background-color: #ddd;
        }

        li a.active {
            color: white;
            background-color: #4CAF50;
        }
        /*----------------------------------------------------------------------------------*/
        main{
            height:400px;
        }

        .content{
            display: flex;
            flex-wrap: wrap;
        }

        .item{
            width: 200px;
        }



        .pagination {
            display: flex;
            justify-content: flex-end;
        }
        .pagination a {
            color: black;
            float: left;
            padding: 8px 16px;
            text-decoration: none;
            transition: background-color .3s;
            border: 1px solid #ddd;
        }

        .pagination a.active {
            background-color: #4CAF50;
            color: white;
            border: 1px solid #4CAF50;
        }

        .pagination a:hover:not(.active) {background-color: #ddd;}


        footer{
            height:60px;
            display: flex;
            justify-content: center;

        }

    </style>
    <meta charset="UTF-8">
    <title>Insert title here</title>
</head>
<body>
<div class="top">
    <div>
        <c:if test="${empty sessionScope.user}">
            <a href="login.jsp">请登录</a> <a href="register.jsp">请注册</a>
        </c:if>
        <c:if test="${not empty sessionScope.user}">
            <span>欢迎！${sessionScope.user.name}</span>
        </c:if>
    </div>
    <a href="shoppingCar">购物车</a>
</div>

<header>
    <img alt="" src="image/homepage/logo.png">
    <form action="search" method="get">
        <input type="search" name="keyword"/>
        <input type="hidden" value="${requestScope.homeData.sort}" name="sort"/>
        <input type="submit"/>
    </form>
</header>

<nav>
    <ul>
        <li><a class="${requestScope.homeData.sort==0?'active':''}" href="HomeController">首页</a></li>
        <li><a class="${requestScope.homeData.sort==1?'active':''}" href="HomeController?sort=1">食品</a></li>
        <li><a class="${requestScope.homeData.sort==2?'active':''}" href="HomeController?sort=2">电器</a></li>
        <li><a class="${requestScope.homeData.sort==3?'active':''}" href="HomeController?sort=3">书籍</a></li>
    </ul>
</nav>

<main>
    <div class="content">
        <c:forEach  var="commodity"  items="${requestScope.homeData.commodityList}">
            <div class="item">
                <img alt=""  src="${commodity.imgpath}">
                <div>${commodity.description}</div>
                <div>${commodity.price}<button onclick="location.href='shoppingCar?commodityId=${commodity.id}&action=add'">加入购物车</button></div>
            </div>
        </c:forEach>
    </div>
    <%
        HomeData homeData=(HomeData) request.getAttribute("homeData");
        int i=homeData.getCurPage();
    %>
    <div class="pagination">
        <%
            String url="HomeController";
            String sortParam="sort="+homeData.getSort();
            String previousPage="curPage="+(homeData.getCurPage()==1?1:homeData.getCurPage()-1);
            String nextPage="curPage="+(homeData.getCurPage()==homeData.getTotalPages()?homeData.getCurPage():homeData.getCurPage()+1);
            String keywordParam="keyword="+homeData.getKeyword();
        %>
        <%
            out.println("<a href="+"\""+url+"?"+(homeData.getSort()!=1?sortParam:"")+"&"+previousPage+(homeData.getKeyword()!=null?"&"+keywordParam:"")+"\">"+"«"+"</a>");
        %>
<%--        <a href="HomeController?sort=${requestScope.homeData.sort}&curPage=${i==1?i:requestScope.homeData.curPage-1}${requestScope.homeData.keyword!=null?"&keyword=".concat(requestScope.homeData.keyword):""}">«</a>--%>
        <c:forEach var="i" begin="${requestScope.homeData.firstPageForNavigation}" end="${requestScope.homeData.lastPageForNavigation}">
            <a href="HomeController?sort=${requestScope.homeData.sort}&curPage=${i}${requestScope.homeData.keyword!=null?"&keyword=".concat(requestScope.homeData.keyword.toString()):""}" class="${requestScope.homeData.curPage==i?'active':''}">${i}</a>
        </c:forEach>
        <%
            out.println("<a href="+"\""+url+"?"+(homeData.getSort()!=1?sortParam:"")+"&"+nextPage+(homeData.getKeyword()!=null?"&"+keywordParam:"")+"\">"+"»"+"</a>");
        %>
<%--        <a href="HomeController?sort=${requestScope.homeData.sort}&curPage=${i eq requestScope.homeData.totalPages?i:requestScope.homeData.curPage+1}${requestScope.homeData.keyword!=null?"&keyword=".concat(requestScope.homeData.keyword):""}">»</a>--%>
    </div>
</main>

<footer>
    <div>版权：信息学院</div>
</footer>

</body>
</html>